<!DOCTYPE html>
<html>
	<head>
			<meta charset="utf-8">
			<title></title>
			<!-- 引入jQuery -->
			<script src="jquery-3.7.1.js" type="text/javascript" charset="utf-8"></script>
			
			<style type="text/css">
				div{
					width: 200px;
					height: 100px;
					background-color: lightblue;
					margin: 10px;
				}
				
				.two
				{
					background-color: greenyellow;
				}
			</style>
		</head>
		<body>
			
			<div id="div01"></div>
			<div id="div02"></div>
			<div id="div03"></div>
			<div id="div04"></div>
			<div id="div05"></div>
			<div id="div06">
				<input type="text" id="input06"/>
			</div>
			
			<script type="text/javascript">
				
				// $(选择题)
				
				// 设置样式
				// .css()
				// $("div").css("background-color","red");			
				$("#div02").css("background-color","blue");
				
				// 添加事件
				$("#div03").click(function(){
					alert("div03点击了");
				});
				
				// 修改内容
				$("#div04").html("<a href='https://www.baidu.com'>百度</a>");
				$("#div05").text("<a href='https://www.baidu.com'>百度</a>");
				$("#input06").val("哈哈");
				
				// 修改属性
				$("#div06").attr("class","two");
				$("#div06").removeAttr("class");
				// $("#div06").addClass("two");
				// $("#div06").removeClass("two");
			</script>
			
		</body>


</html>
